<template>
  <div class="blog-post" @click="$emit('click')">
    <h2>{{ post.title }}</h2>
    <p>{{ post.content }}</p>
    <span>{{ post.date }}</span>
  </div>
</template>

<script>
export default {
  props: {
    post: {
      type: Object,
      required: true
    }
  }
}
</script>

<style scoped>
.blog-post {
  cursor: pointer;
  margin-bottom: 1rem;
}
</style>